<template>
  <div class="out-nav">
    <el-button type="warning" icon="LocationFilled" @click="showAddUser = true">物流信息</el-button>
    <teleport to="body">
      <el-dialog v-model="showAddUser" title="物流信息" width="40%">
        <el-timeline>
          <el-timeline-item v-for="(item, index) in data" :key="index" :timestamp="item.ftime" type="primary"
            :hollow="true">
            {{ item.context }}
          </el-timeline-item>
        </el-timeline>
      </el-dialog>
    </teleport>
  </div>
</template>
  
<script setup>
import { defineProps, reactive, ref } from "vue";
import { getLogistics } from "@/api/order";
const props = defineProps({
  getList: {
    type: Function,
  },
  scope: {
    type: Object,
    default: function () { },
  },
});
let showAddUser = ref(false);
let data = reactive([])
const getLogistic = async () => {
  //供测试的物流单号：1106975712662
  let res = await getLogistics(1106975712662 || props.scope.row.logistic);
  data.splice(0);
  data.push(...res.data);
}
getLogistic();
// console.log(props);
</script>
  
<style lang="scss" scoped>
.out-nav {
  display: inline-block;
  margin: 0 10px;
}

.el-dialog {
  padding: 100px;
}
</style>